import Taro, { Component, Config } from '@tarojs/taro'
import { View, Text,Button,Image } from '@tarojs/components'
import Tabbar from '../../componrnts/tabBar'
import {AtSearchBar, AtSwipeAction  } from 'taro-ui'
import '../../assets/css/home.scss'
export default class Home extends Component {
  constructor (props) {
    super(props)  
    this.state = {
      current:1,
      value:'',
      text:'默认的值',
      opcation:[
        {
          text: '取消',
          style: {
            backgroundColor: '#6190E8'
          }
        },
        {
          text: '确认',
          style: {
            backgroundColor: '#FF4949'
          }
        }
      ]
    }
  }
  componentWillMount () {
        console.log(this.$router.params)
        this.setState({
          value:this.$router.params.userid
        })
   }
  componentDidMount () {
    
  }
  
  componentWillUnmount () { 
   
  }

  componentDidShow () { }

  componentDidHide () { }
  onChange (value) {
    this.setState({
      value: value
    })
    console.log(555)
    Taro.request({
      url: 'http://mobilecdnbj.kugou.com/api/v3/rank/list?version=9108&plat=0&showtype=2&parentid=0&apiver=6&area_code=1&withsong=1&with_res_tag=1',
      data: {
        foo: 'foo',
        bar: 10
      },
      header: {
        'content-type': 'application/json'
      }
    }).then(res =>{
      console.log(res.data)
    }) 
  }
  clearvalue(){
    this.setState({
      text: ''
    })
  }
  handleClick(){

  }
  render () {
    return (
      <View className='active'>
           <AtSearchBar
              value={this.state.text}
              onActionClick={this.onChange.bind(this)}
              onClear={this.clearvalue.bind(this)}
            />
                  <Text>我是home页面</Text>
                  <view>跳转传参的用户id是：{this.state.value}</view> 
                  <AtSwipeAction onClick={this.handleClick}  options={this.state.opcation} className='ddd'>
        <View className='normal opation'>点击事件触发</View>
      </AtSwipeAction>
           {/* <Tabbar onCurrent={this.state.current}/> */}
      </View>
    )
  }
}
